<template>
	<div>
		<el-button type="primary" @click="addBoss.visible = true">添加boss</el-button>
		<el-button type="danger" @click="deleteBoss.visible = true"> 删除已选择boss </el-button>&nbsp;
		<el-button type="danger" @click="edit.visible = true"> 重设所有boss死亡时间 </el-button>&nbsp;
		<span>提前</span>&nbsp;
		<el-input v-model="tipsTime" placeholder="请输入内容" style="width: 100px"></el-input
		>&nbsp;<span>秒响铃</span> <span>&nbsp;&nbsp;&nbsp;实时刷新： </span
		><el-switch v-model="realTime" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
		<BossTable ref="table" :tipsTime="tipsTime" @edit="handleEdit" />
		<!-- 添加 -->
		<el-dialog title="添加Boss" :visible.sync="addBoss.visible" width="30%" :before-close="null">
			<AddBoss ref="form" />
			<span slot="footer" class="dialog-footer">
				<el-button @click="addBoss.visible = false">取 消</el-button>
				<el-button type="primary" @click="handleAddBoss">确 定</el-button>
			</span>
		</el-dialog>
		<!-- 删除 -->
		<el-dialog title="提示" :visible.sync="deleteBoss.visible" width="30%" :before-close="null">
			<span>确认删除所选boss?</span>
			<span slot="footer" class="dialog-footer">
				<el-button @click="deleteBoss.visible = false">取 消</el-button>
				<el-button type="primary" @click="handleDeleteBosses"> 确 定 </el-button>
			</span>
		</el-dialog>
		<!-- 修改死了多久 -->
		<el-dialog title="死了多久？" :visible.sync="edit.visible" width="30%">
			<span>死了多久？(单位时间)</span>
			<el-input v-model="edit.boss.exprience" style="margin-top: 40px" />
			<span slot="footer" class="dialog-footer">
				<el-button @click="edit.visible = false">取 消</el-button>
				<el-button type="primary" @click="modifyAllLastDeath">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
import AddBoss from './AddBoss.vue'
import BossTable from './BossTable'
import http from '../interactive/index.js'
export default {
	name: 'Hone',
	components: {
		BossTable,
		AddBoss,
	},
	data() {
		return {
			addBoss: {
				visible: false,
			},
			deleteBoss: {
				visible: false,
			},
			// 实时刷新
			realTime: true,
			tipsTime: 10,
			edit: {
				visible: false,
				boss: {
					lastDeath: '',
					exprience: null,
				},
			},
		}
	},
	mounted() {
		this.$http({
			url: '/api/config/tipsTime',
		}).then((res) => {
			if (res.data.status === 200) {
				this.tipsTime = res.data.result.tipsTime
			}
		})
	},
	watch: {
		realTime(val) {
			this.$refs.table.switchTimer(val)
		},
		tipsTime(val) {
			this.$http({
				url: '/api/config/tipsTime',
				method: 'put',
				data: {
					tipsTime: val,
				},
			}).then((res) => {
				if (res.data.status === 200) {
				} else {
					this.$message.error('修改失败')
				}
			})
		},
	},
	methods: {
		handleAddBoss() {
			const form = { ...this.$refs.form.form }
			form.rebornCycle = parseInt(form.rebornCycle) * 60
			form.lastDeath = `${this.$dayjs().year()}/${form.lastDeath}`
			this.$http({
				url: '/api/boss/boss',
				method: 'post',
				data: form,
			}).then((res) => {
				this.addBoss.visible = false
				if (res.data.status === 200) {
					this.$message.success('添加成功')
				} else {
					this.$message.error('添加失败')
				}
				this.$refs.table.update()
			})
		},
		handleDeleteBosses() {
			this.$refs.table.deleteBoss()
			this.deleteBoss.visible = false
		},
		handleEdit(row) {
			this.edit.boss.id = row.id
			this.edit.boss.lastDeath = this.$dayjs().format('MM/DD HH:mm:ss')
			this.edit.visible = true
		},
		modifyAllLastDeath() {
			this.edit.visible = false
			let ids = []
			this.$refs.table.tableData.forEach((e) => {
				ids.push(e.id)
			})
			let date = this.$dayjs.unix(this.$dayjs().unix() - this.edit.boss.exprience * 60)
			http.setLastDeathAll(ids, date)
			this.$refs.table.update()
		},
	},
}
</script>
